
body{
    font-family: Serif !important;
    cursor: url(https://cdn.jsdelivr.net/gh/moezx/cdn@3.1.9/img/Sakura/cursor/normal.cur), auto;
}
.chinese-font {
    font-family: Serif !important;
}

::-webkit-scrollbar{
    width:10px;       /* 宽度 */
}
::-webkit-scrollbar-thumb{
    background-color:rgb(255, 165, 0,.7);   /* 颜色 */   
    border-radius:20px;                       /* 圆角 */
}
::-webkit-scrollbar-track {
    background-color: white; /* 背景色 */
}

.box{
    width: 100%;
    height: 100%;
    /* background-color:pink; */
}
.box .GoTop {
    width:50px;
    height:40px;
    padding:0;
    background-color:pink;
    position:fixed;
    z-index:1000;
    border-radius:5px;
    overflow:hidden;
    bottom:80px;
    right:50px;
    transition:all 0.5s;
    display:none;

}
.box .GoTop .gotops{
    width:100%;
    height:100%;
    display:flex;
    justify-content:center;
    align-items:center;
}
.box .GoTop .gotops .gotopimg{
    display:inline-block;
    width:20px;
    height:20px;
}
.box .GoTop:hover{
    box-shadow:  0 0  10px 10px rgb(255, 255, 255,.7);
}
.box .GoTop .gotops:hover{
    border-bottom-color:aqua;
}
.box .top{
    width:100%;
    height:75px;
    background-color:transparent;
    /* background-color:#ffffff; */
    position:fixed;
    top:0;
    left:0;
    z-index:10;
    /* display:none;  */
    transition:all 0.5s;
}
.box .top .tops:hover{
    background-color:rgb(255, 255, 255,.9);
    /* transition: #ffffff 0.6s; */
    transition:all 1s;
}
.box .top .tops{
    width:100%;
    height:100%;
    position:relative;
    z-index: 200;
    transition:all 0.5s ;
}
.box .top .tops .main{
    width:100%;
    height:0;
}
.top .tops .left{
    position:relative;
}
.top .tops .left .logo{
    position: absolute;
    padding:3px 10px;
    font-size:24px;
    font-weight:bold;
    color:rgb(255, 192, 203,.8);
    background-color:rgb(255, 255, 255,.6);
    border-radius:7px;
    top:11px;
    left:30px;
    user-select: none;
    transition:all 0.5s;
}
.top .tops .left .logo:hover{
    background-color:rgb(255, 192, 203) ;
    color:white;
    transition:all 0.5s;
}
.top .tops .right{
    position: relative;
}
.top  .log{
    position:absolute;
    right:20px;
    top:20px;
    cursor:pointer;
}
.top .search{
    position:absolute;
    right:70px;
    top:20px;
    cursor:pointer;
}
.box .searchbox{
    position:fixed;
    width:100%;
    height:100vh;
    background-color: rgb(255, 255, 255,.6);
    display:none;
    backdrop-filter: blur(10px);
    z-index:30;
    transition:all 0.5s;
}
.box .searchbox .orient{
    width:100%;
    height:100%;
    position: relative;
}
.box .searchbox .orient .git{
    position: absolute;
    bottom:5%;
    right:5%;
}
.box .searchbox .searchboxs{
    width:80%;
    height:60px;
    padding:16px 20px;
    border:2px solid rgb(174, 119, 232,.9);
    /* 禁止拖动修改输入框 */
    resize:none;
    outline-width: 0;
    border-radius:30px;
    font-size:18px;
    /* 文字不换行 */
    white-space:nowrap;
    overflow:hidden;
    user-select: none;
    position: absolute;
    top:20%;
    left:50%;
    transform: translate(-50%,-70%);
    color:orangered;
}
.box .searchbox .delete{
    position:absolute;
    width:30px;
    height:30px;
    /* transform: translate(100%,50%); */
    top:10%;
    left:90%;
    transform:translate(60%,-90%);
    cursor:pointer;
}

.box .searchbox .delete::before,
.box .searchbox .delete:after{
    content: '';
    position: absolute;
    width:30px;
    height:2px;
    background-color:rgb(174, 119, 232,.9);
}

.box .searchbox .delete::before{
    transform:rotate(45deg);
    /* -webkit-transform: rotate(45deg); */
    top:14px;
    left:0;
}
.box .searchbox .delete::after{
    transform:rotate(-45deg);
    /* -webkit-transform: rotate(-45deg); */
    top:14px;
    left:0;
}

.top  .menu{
    width:30px;
    height:27px;
    position:absolute;
    right:120px;
    top:24px;
    /* cursor:pointer; */
}
.top .tops .main  .menubox li a{
    color:rgb(156, 172, 197);
}
.top  .tops .main  .menubox {
    width:600px;
    height:27px;
    /* background-color:white; */
    position: absolute;
    left:-640px;
    top:0px;
    display:none;

}
.top  .tops .main  .menubox ul{
    display: flex;
    align-items: center;
    justify-content:space-around;

}
.top .tops .main  .menubox ul li{
    font-size: 18px;
    padding: 0px 0px 15px 0px;
    cursor:pointer;
    user-select:none;
    position: relative;
}
.top .tops .main  .menubox ul li a:hover{
    color:rgb(255, 165, 0,.7);
    transition: all 0.5s;
}
.top .tops .main  .menubox  .wenZhang{
    position: absolute;
    border:1px solid skyblue;
    padding:0px 10px;
    background-color:white;
    text-align:center;
    border-radius:5px;
    top:30px;
    left:-5px;
    display:none;
}
.top .tops .main  .menubox  .wenZhang li{
    width:60px;
    margin:10px 0px;
    padding:0;
    
}

.top .tops .main .menu .menubox ul .option-2:hover .wenZhang{
    display:block;
}

.top .tops .main  .menubox  .guanYu{
    position: absolute;
    border:1px solid skyblue;
    padding:0px 10px;
    background-color:white;
    text-align:center;
    border-radius:5px;
    top:30px;
    left:-30px;
    display:none;
}
.top .tops .main  .menubox  .guanYu li{
    width:80px;
    margin:10px 0px;
    padding:0px;
}
.top .tops .main .menu .menubox ul .option-6:hover .guanYu{
    display:block;
}
.top .menu .line{
    width:28px;
    height:2px;
    background-color:#666666;
    border-radius:5px;
    border:0;
}
.top .menu:hover .line{
    background-color: rgb(255, 165, 0,.7);
}
.top .menu .line.line2{
    margin-top:8px;
}
.top .menu .line.line3{
    margin-top:8px;
}
.box .top .tops .main .deleteNone{
    width:30px;
    /* height:30px; */

}
.box .top .tops .main .deletes{
    position:absolute;
    width:30px;
    height:30px;
    /* transform: translate(100%,50%); */
    top:47px;
    right:140px;
    transform:translate(60%,-90%);
    cursor:pointer;
    display:none;
}
.box .top .tops .main .deletes::before,
.box .top .tops .main .deletes:after{
    content: '';
    position: absolute;
    width:30px;
    height:2px;
    background-color:rgb(255, 165, 0,.7);
}

.box .top .tops .main .deletes::before{
    transform:rotate(45deg);
    /* -webkit-transform: rotate(45deg); */
    top:14px;
    left:0;
}
.box .top .tops .main .deletes::after{
    transform:rotate(-45deg);
    /* -webkit-transform: rotate(-45deg); */
    top:14px;
    left:0;
}

.top .main .right img{
    display:inline-block;
    width:30px;
    height:30px;
    /* 禁止选中 */
    user-select:none;
}
.openbox{
    width:250px;
    height:100vh;
    display:none;
    /* overflow:hidden; */
    position:fixed;
    top:0;
    left:0;
    z-index: 100;

}
.openNav{
    /* display:inline-block; */
    width:250px;
    height:100vh;
    background-color:rgb(255, 255, 255,.9);
    /* position: absolute; */
    top:0;
    left:0;
    /* overflow:hidden;  */
    /* display:none; */
    /* display:block; */
    z-index: 110;
    transition:all 2s;
    position:relative;
    overflow-y:scroll;
    /* overflow-x:auto; */
}

.openNav .Stouxiang{
    width:100px;
    height:100px;
    /* background-color:red; */
    border-radius:50%;
    position:absolute;
    top:70px;
    left:75px;
    border:1px solid white;
    overflow: hidden;
    color:red;
}
.openNav .Stouxiang .Stouxiangimg{
    width:100%;
    height:100%;
    border-radius:50%;
}
.openNav .opensearch{
    width:200px;
    height:50px;
    padding:12px 20px;
    border-radius:15px;
    overflow:hidden;
    user-select:none;
    resize:none;
    /* 文字不换行 */
    white-space:nowrap;
    outline-color:aqua;
    position:absolute;
    top:200px;
    left:25px;
    color:orangered;
}
.openNav .openboxs{
    width:100%;
    height:100%;
    position: absolute;
    top:270px;
    text-align:center;
}
.openNav .openboxs ul{
    margin:0;
}
.openNav .openboxs a{
    text-decoration:none;
}
.openNav .openboxs ul .option-1 .expend,.option-2 .expend,.option-3 .expend,.option-4 .expend,.option-5 .expend,.option-6 .expend{
    font-size:21px;
    /* color:red !important; */
    color:rgb(174, 119, 231);
    font-weight:bold;
    /* padding:0px 0px 10px 0px;  */
}
.openNav .openboxs ul .option-1 .expend:hover,.option-2 .expend:hover,.option-3 .expend:hover,.option-4 .expend:hover,.option-5 .expend:hover,.option-6 .expend:hover{
    color:rgb(211, 97, 209);
}

.openbox .openNav .openboxs ul .option-1,.option-2,.option-3,.option-4,.option-5,.option-6{
    padding:0px 0px 10px 0px;
}
.openbox .openNav .openboxs ul .option-1 ol,.option-2 ol,.option-3 ol,.option-4 ol,.option-5 ol,.option-6 ol{
    margin:10px 0px;
}
.openbox .openNav .openboxs ul .option-1 ol li,.option-2 ol li,.option-3 ol li,.option-4 ol li,.option-5 ol li,.option-6 ol li{
    
    margin:10px 0px;
}
.openbox .openNav .openboxs ul .option-1 ol .olli a,.option-2 ol .olli a,.option-3 ol .olli a,.option-4 ol li .olli a,.option-5 ol .olli a,.option-6 ol .olli a{
    color:rgb(156, 172, 197);
}
.openbox .openNav .openboxs ul .option-1 ol li a:hover,.option-2 ol li a:hover,.option-3 ol li a:hover,.option-4 ol li a:hover,.option-5 ol li a:hover,.option-6 ol li a:hover{
    color:rgb(211, 97, 209);
}
.openNav .openboxs ol .olli{
    font-size:18px;
    /* font-weight:bold; */
}
.openNone{
    width:35px;
    height:35px;
    position: fixed;
    top:2%;
    left:6%;
    display:none;
    z-index: 10;
}
.openNone .openbtn{
    width:35px;
    height:35px;
    /* border:2px solid plum; */
    left:300px;
}

.box .openbtn  .line{
    width:25px;
    height:3px;
    /* background-color:rgb(102, 102, 102); */
    /* border-radius:5px; */
    border:0;
    background-color: rgb(255, 165, 0);
    position: relative;
    left:3px;
    top:15px;
}

.box .openbtn  .line::after{
    content: '';
    position: absolute;
    width:25px;
    height:3px;
    border:0;
    background-color:rgb(255, 165, 0);
    top:-10px;
    left:0;
}
.box .openbtn .line::before{
    content: '';
    position: absolute;
    width:25px;
    height:3px;
    border:0;
    background-color:rgb(255, 165, 0);
    top:10px;
    left:0;
}

.box .opendelete{
    position: fixed;
    width:30px;
    height:30px;
    /* transform: translate(100%,50%); */
    top:15px;
    /* right:140px; */
    left:330px;
    /* transform:translate(60%,-90%); */
    cursor:pointer;
    display:none;
    z-index: 100;
}

.box .opendelete::before,
.box .opendelete::after{
    content: '';
    position: absolute;
    width:25px;
    height:3px;
    background-color:rgb(255, 255, 255);
}

.box .opendelete::before{
    transform:rotate(45deg);
    /* -webkit-transform: rotate(45deg); */
    top:14px;
    left:3px;
}
.box .opendelete::after{
    transform:rotate(-45deg);
    /* -webkit-transform: rotate(-45deg); */
    top:14px;
    left:3px;
}
/* .top .menu:hover .line1{
    background-color: rgb(255, 165, 0,.7); 
} */

.bg{
    width:100%;
    height:100vh;
    overflow:hidden; 
    /* margin-right:250px; */
    /* height:1200px; */
    /* height:1200px; */
}
.mask::before {
    content: "";
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: rgba(0, 0, 0, .4);
    /* user-select:none; */
    z-index: 99;
}

.bg .bgPhoto{
    width:100%;
    height:100%;
    background-repeat:no-repeat;
    background-image:url(../images/beyond_by_auroralion-dan5njb.jpg);
    /* background-image:url(../images/海の空_by_夏T.jpg); */
    /* background-image: url(../images/pixar_up_movie_balloons_desktop_1920x1080_hd-wallpaper-507967.jpg); */
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    background-size:cover;
    background-position:center;
    position:relative;
    overflow:hidden;
    transition:all 0.5s;
}

/* i.iconfont.js-toggle-search.iconsearch {
    color: #666;
    cursor: pointer;
    font-size: 26px;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.iconfont {
    font-family: "iconfont" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.icon-search:before {
    content: "\e690";
} */

.box .bg .bgPhoto .personal{
    width:50%;
    height:250px;
    /* background-color:pink; */
    position:absolute;
    top:50%;
    /* 控制页面的位置 */
    transform: translate(-50%,-30%);
    left:50%;
}
.box .bg .bgPhoto .personal .header-tou{
    width:100%;
    height:135px;
    display:flex;
    justify-content: center;
}
.box .bg .bgPhoto .personal .header-tou .touxiang img{
    display:inline-block;
    width:130px;
    height:130px;
    background-repeat: repeat;
    /* background-size: */
    /* background-position: center; */
    border-radius:50%;
    border:4px solid rgb(156, 139, 111,.6);
    user-select:none;
}

.box .bg .bgPhoto .personal .header-info{
    margin: 25px 30px 0 30px;
    padding:10px;
    background-color:rgb(0, 0, 0,.6);
    border-radius:12px;
}
.box .bg .bgPhoto .personal .header-info .text{
    margin:0;
    height:30px;
    /* font-family:Ubuntu, sans-serif; */
    font-family: sans-serif;
    font-weight:700;
    /* font-size:21px; */
    text-align:center;
    color:white;
    user-select:none;
    /* 文本强制不换行 */
    white-space:nowrap;
    /* 文本溢出显示省略号 */
    /* text-overflow:ellipsis; */
    /* 溢出隐藏 */
    overflow:hidden;
}

/* 设置鼠标悬浮图片放大 */
img{
    display:inline-block;
    background-repeat:no-repeat;
    background-size:cover;
    border-radius:10px;
    /* 过渡动画 */
    transition:all 0.5s;
    cursor: url(https://cdn.jsdelivr.net/gh/moezx/cdn@3.1.9/img/Sakura/cursor/ayuda.cur), auto;
}
.imgbox{
    width:256px;
    height:160px;
    overflow:hidden;
    border-radius:10px;
} 
/* 图片放大的效果 */
img:hover{
    transform:scale(1.2);
}

.box .content{
    width:100%;
    /* height:100%; */
    height:1000px;
    position:relative;
    box-sizing:border-box;
    overflow:hidden;
}
.box .content .partOne{
    width:80%;
    height:304px;
    background-color:white;
    position:absolute;
    border-radius:5px;
    left:10%;
    top:10%;
}
.box .content .partOne .fa{
    display:inline-block;
    width:100%;
    font-size:21px;
    padding:20px;
    border-bottom:2px solid pink;
    user-select:none;
    margin:0px 0px;
}
.box .content .partOne .partmain{
    width:100%;
    height: 233px;
    /* border:1px solid blue; */
    display:flex;
    align-items:center;
    justify-content:space-around;
}
.images-1{
    height:160px;
    width:256px;
}
.box .content .partOne .one{
    width:250px;
    height:160px;
    /* background-repeat:no-repeat; */
    border-radius:10px;
}
.box .content .partOne .two{
    width:250px;
    height:160px;
    border-radius:10px;
}
.box .content .partOne .three{
    width:250px;
    height:160px;
    border-radius:10px;
}
.box .content .partTwo{
    width:80%;
    /* height:772px; */
    height:100%;
    position:absolute;
    background-color:white;
    left:10%;
    top:50%;
}
.box .content .partTwo .fa{
    display:inline-block;
    width:100%;
    font-size:21px;
    padding:20px;
    border-bottom:2px solid pink;
    user-select:none;
}
.box .content .partTwo .partmain{
    display:flex;
    box-sizing:border-box;
    margin-top:30px;
    /* height:360px; */
}
.box .content .partTwo .partLeft{
    overflow:hidden;
}
.box .content .partTwo .partLeft .leftBox{
    width:100%;
    height:100%;
    overflow:hidden;
    border-radius:10px;
}
.box .content .partTwo .partLeft .leftBox .fine{
    width:100%;
    height:100%;
    /* border:1px solid red; */
}
.box .content .partTwo .partLeft .leftBox .fine:hover{
    transition:all 1s !important;
}
.box .content .partTwo .partRight{
    width:100%;
    height:100%;
    /* border:1px solid blue; */
    padding:10px;
    /* background-image: url(../images/s21.jpg); */

}
.box .content .partTwo .partRight p{
    color:rgb(0, 0, 0);
    font-size:17px;
    font-family:"华文行楷";
    text-align:center;

}
.box .content .partTwo .partRight .title{
    font-family:"华文行楷";
    font-size:17px;
    display:none;
    text-align:center;
}


/* 媒体查询 */
/* 小于指定高度时产生效果 */
@media screen and (max-width:1260px){
    .log,.search,.menu,.deleteNone{
        display:none;
    }
    .openNone{
        display:block;
    }
    .box .top .tops .right{
        position:absolute;
        left: 200px;
    }
    .box .top .tops .left{
        position: absolute;
        right:180px;
    }
    .box .bg .bgPhoto .personal .header-info .text{
        font-family:serif;
    }
    .box .content .partTwo .partRight p{
        font-family:serif;
    }
    .box .GoTop {
        right:30px;
    }

}

@media screen and (max-width:1100px){
    .box .content .partOne{
        display:none;
    }
    .box .content .partTwo{
        top:10%;
    }
    .box .content .partTwo .partLeft .leftBox{
    width:700px;
    height:350px;
    }
    .box .content .partTwo .partLeft .leftBox .fine{
        height:350px;
    }

    .box .content .partTwo .partLeft .leftBox{
        width:100%;
        height:100%;
        overflow:hidden;
        border-radius:10px;
    }
    .box .content .partTwo .partLeft .leftBox .fine{
        width:100%;
        height:100%;
        /* border:1px solid red; */
    }
    .box .content .partTwo .partmain{
        display:block;
    }
    .box .GoTop {
        right:30px;
    }

}

@media screen and (max-width:830px){
    .box .content .partTwo .partLeft .leftBox{
        width:100%;
        height:100%;
        overflow:hidden;
        border-radius:10px;
    }
    .box .content .partTwo .partLeft .leftBox .fine{
        width:100%;
        height:100%;
        /* border:1px solid red; */
    }
    .box .content .partTwo .partRight .title{
        display:block;
        font-size:21px;
    }
    .box .content .partTwo .partRight p{
        font-family:"华文行楷"
    }
    .box .GoTop {
        right:30px;
    }

}


    








